<template>
	<view class="personal">
		<!-- 顶部作者栏 -->
		<view class="p_auth">
			<!-- <nav-bar :background="navBackground" isBack :backColor="navBackColor" isFloor
				:floorOpacity="navFloorOpacity">
				<view class="p_aCan" :class="{'active': navShow}" slot="center">
					<view class="p_aHead">
						<image :src="designer.avatar.path"></image>
					</view>
					<view class="p_aName omit-1">{{designer.name}}</view>
					<view class="p_aFocus" :class="{'active': isFocus == 1}" @tap="focusSDesigner">
						{{isFocus == 1 ? '已关注' : '关注'}}
					</view>
				</view>
			</nav-bar> -->
			<nav-bars class="i_top" :bgColor="navBackground" :fontColor="navBackColor">
				<view class="i_tCan" slot="default">
					<view class="p_aCan" :class="{'active': navShow}" slot="center">
						<view class="p_aHead">
							<image v-if="designer.avatar.path" :src="designer.avatar.path" ></image>
						</view>
						<view class="p_aName omit-1">{{designer.title}}</view>
						<view class="p_aFocus" :class="{'active': isFocus == 1}" @tap="focusSDesigner">
							{{isFocus == 1 ? '已关注' : '关注'}}
						</view>
					</view>
				</view>
			</nav-bars>
		</view>

		<!-- 背景墙 -->
		<view class="p_wall">
			<view class="p_wPicture">
				<image v-if="designer.back_thumb_url.path" :src="designer.back_thumb_url.path"></image>
			</view>
			<view class="p_wShadow"></view>
		</view>

		<!-- 用户信息 -->
		<view class="p_user">
			<view class="p_uHeadimg">
				<image v-if="designer.avatar.path" :src="designer.avatar.path"></image>
			</view>
			<view class="p_uFocus" @tap="focusSDesigner">
				<view class="p_ufCan" :class="{'active': isFocus == 1}">{{isFocus == 1 ? '已关注' : '+ 关注'}}</view>
			</view>
			<view class="p_uName" id="userName">{{designer.title}}</view>
			<view class="p_uBase">
				<!-- <view class="p_ubItem"><text>{{designer.fans_num}}</text>人被关注</view> -->
				<view class="p_ubItem"><text>{{designer.fans_num}}</text>粉丝</view>
				<!-- <view class="p_ubItem"><text>{{designer.user_case_collect_num}}</text>收藏</view> -->
			</view>
			<view class="p_uTags">
				<view class="p_uTag" v-for="item in designer.design_style" :key="item.name">{{item.name}}</view>
			</view>
			<view class="p_uData">
				<view class="p_udMore" @tap="infoPop = true">
					<view class="p_udIcon">
						<image src="/static/common/icon_more.png"></image>
					</view>
				</view>
				<view class="p_udList">
					<view class="p_udItem">
						<view class="p_udLabel">装修均价</view>
						<view class="p_udVal">{{designer.start_offer + '-' + designer.end_offer}}元/m²</view>
					</view>
					<!-- <view class="p_udItem">
						<view class="p_udLabel">资质信息</view>
						<view class="p_udVal">
							<view>
								<text>{{designer.quality_info.name}}</text><text class="p_udCutline"></text>
							</view>
						</view>
					</view> -->
					<view class="p_udItem">
						<view class="p_udLabel">服务类型</view>
						<view class="p_udVal">
							<view v-for="item in designer.service_type" :key="item.name">
								<text>{{item.name}}</text><text class="p_udCutline"></text>
							</view>
						</view>
					</view>
					<view class="p_udItem">
						<view class="p_udLabel">个性签名</view>
						<view class="p_udVal">
							<view
								style="text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;">
								{{designer.sign}}
							</view>
						</view>
					</view>
				</view>
			</view>
			<!-- 定位 -->
			<!-- <view class="location" @click="getAddress">
				<view class="location_des" style="">
					<view class="location_title" style="">爵士·帝洛菲装修</view>
					<view class="location_icon" style="">
						<u-icon name="map-fill" size="30" color="#FADF7D"></u-icon>
					</view>
				</view>
				<view class="location_Mes" style="">
					<view>营业时间：周一到周日 09:00-21:00</view>
					<view>88.2km</view>
				</view>
			</view> -->
		</view>

		<!-- 数据列表 -->
		<view class="p_data">
			<view class="p_dContain">
				<view class="p_dSticky" :style="{'top': navHeight + 'px'}">
					<view class="p_dTabs" id="tabBar">
						<view class="p_dtItem" id="tabBar_Demo" :class="{'active': tabType === 'Demo'}"
							@tap="tabToggle('Demo')">案例</view>
						<view class="p_dtItem" id="tabBar_Team" :class="{'active': tabType === 'Team'}"
							@tap="tabToggle('Team')">团队</view>
						<view class="p_dtItem" id="tabBar_Dyna" :class="{'active': tabType === 'Dyna'}"
							@tap="tabToggle('Dyna')">动态</view>
						<view class="p_dtItem" id="tabBar_Eval" :class="{'active': tabType === 'Eval'}"
							@tap="tabToggle('Eval')">评价</view>
						<view class="p_dtCursor" id="tabBar_Cursor"
							:style="{'transform': 'translateX(' + (tabBarCursorX ? tabBarCursorX : '48r') + 'px)'}">
						</view>
					</view>
				</view>
				<view class="p_dCan">
					<!-- 装修案例 -->
					<view class="p_dList" id="tabItem_Demo">
						<view class="p_dTitle">
							<view class="p_dNums" @tap="toPage('demo_list')">
								<text>{{designer.case_num}}个</text>
								<view class="p_dArrow iconfont icon-more"></view>


							</view>
							<text>装修案例</text>
						</view>
						<view class="p_dDemo">
							<view v-if="demoList.length > 0 || demoList.length !== 0">
								<view v-for="(items,index) in demoList" :key="index" v-if="index<3">
									<view class="p_ddItem" @tap="toPage('demo_detail' , { trendId: items.id })">
										<view class="p_ddBanner">
											<image :src="items.thumb_url[0].path"></image>
											<view class="i_tBtn" @tap.stop="dviewr(items.display_url)"
												v-if="items.display_url">
												<view class="i_tbImg">
													<image src="@/static/home/3d.png"></image>
												</view>
												<view class="i_tbTxt">3D</view>
											</view>
										</view>
										<view class="p_ddInfo">
											<view class="p_ddTag" v-if="items.design_style">
												<text v-for="(itemv,index) in items.design_style"
													:key="index">{{itemv.name}}</text>
											</view>
											<view class="p_ddCont">
												<view class="p_ddVal">
													<text> {{items.area}} m² ｜</text>
													<text> {{items.house_type}} ｜ </text>
													<text> {{items.offer}}万</text>
												</view>
											</view>
										</view>
										<view class="p_ddRemark">{{items.title}}</view>
									</view>
								</view>
							</view>
							<view v-else>
								<u-empty icon-color="#eee" color="#eee" text="暂无案例" mode="data"></u-empty>
							</view>
							<view class="p_dBtn" v-if="demoList.length > 3" @tap="toPage('demo_list')">查看全部案例</view>
						</view>
					</view>
					<!-- 团队 -->
					<view class="p_dList" id="tabItem_Team">
						<view class="p_dTitle">
							<view class="p_dNums" @tap="GoTeam">
								<text>{{designer.team_num}}人</text>
								<view class="p_dArrow iconfont icon-more"></view>

							</view>
							<text>施工团队</text>
						</view>
						<view>
							<view class="i_recomd" v-if="tuanduiArr.length > 0 || tuanduiArr.length !== 0">
								<view class="i_rCan">
									<view class="i_rList">
										<view class="i_rItem" v-for="(item,index) in tuanduiArr" :key="index">
											<view class="i_rImage">
												<image :src="item.avatar.path"></image>
											</view>
											<view class="i_rtitle">施工队长</view>
											<view class="i_rText omit-1">{{item.name}}</view>
											<view class="i_rFee"></view>
											<!-- 从业{{item.worksite_num}}年 -->
										</view>

									</view>
								</view>
							</view>
							<view v-else>
								<u-empty text="暂无施工团队" icon-color="#eee" color="#eee" mode="data"></u-empty>
							</view>
						</view>
					</view>
					<!-- 设计动态 -->
					<view class="p_dList" id="tabItem_Dyna">
						<view class="p_dTitle">
							<view class="p_dNums" @tap="toPage('dynamic_list')">
								<text>{{designer.trend_num}}个</text>
								<view class="p_dArrow iconfont icon-more"></view>

							</view>
							<text>施工动态</text>
						</view>
						<view class="p_dDyna">
							<view v-if="dynaList.length > 0 || dynaList.length !== 0">
								<view v-for="(items,index) in dynaList" :key="index" v-if="index<3">
									<view class="p_ddItem">
										<view class="p_ddUser">
											<view class="p_ddHead">
												<image :src="designer.avatar.path"></image>
											</view>
											<view class="p_ddCan">
												<view class="p_ddName">{{designer.title}}</view>
												<view class="p_ddTime">{{items.create_time | formatDate}}</view>
											</view>
										</view>
										<view class="p_ddTags" @tap="toPage('dynamic_detail', { trendId: items.id })">
											<view v-for="item in items.tags" :key="item">
												<view class="p_ddTag">
													<view class="p_ddTag-icon">
														<image src="/static/common/icon_topic.png"></image>
													</view>
													<text>{{item}}</text>
												</view>
											</view>
										</view>
										<!--  -->
										<view class="p_ddCont">
											<view class="p_ddText"
												@tap="toPage('dynamic_detail', { trendId: items.id })">
												<view style="font-weight: 600;">{{items.title}}</view>
												<view v-if="items.isTalk">
													<view :class="{'omit-3': !items.showTalk}">{{items.content}}</view>
													<view class="p_ddAll">
														<view class="p_ddAll-click" @tap.stop="dyna_showText(items.id)">
														</view>
														{{items.showTalk ? '收起' : '全文'}}
													</view>
												</view>
												<view v-else>
													<view>{{items.content}}</view>
												</view>
											</view>
											<view class="p_ddImgs" v-if="items.type == 0 ">
												<view v-if="indexc<9" v-for="(item,indexc) in items.media"
													:key="indexc">
													<view class="p_ddImg">
														<image :src="item.path"></image>
													</view>
												</view>
											</view>
											<!-- <view class="p_ddImgs" v-if="items.type == 0 && items.media.path">
												<view @tap.stop="previews(items.media.path)">
													<view class="p_ddImg">
														<image :src="items.media.path"></image>
													</view>
												</view>
											</view> -->
											<!-- @tap.stop="previews(items.media.cover)" -->
											<view class="p_ddImgs" v-if="items.type == 1">
												<view v-for="(itemx,indexx) in items.media" :key="indexx">
													<view class="p_ddImg">
														<!-- <image :src="items.media.cover"></image> -->
														<video id="myVideo" style="width: 220rpx;height: 220rpx;"
															:src="itemx.path"></video>
													</view>
												</view>
											</view>
										</view>
										<view class="p_funs">
											<view class="p_fun" @click="popShareToPicture(items.id)">
												<view class="p_fIcon iconfont icon-transpond"></view>
												<text>转发</text>
											</view>
											<view class="p_fun" @tap.stop="dyna_showComment(items)">
												<view class="p_fIcon iconfont icon-comments"></view>
												<text>{{items.comment_num}}</text>
											</view>
											<view class="p_fun" @click="trendStore(items,index)">
												<view class="p_fIcon" v-if="items.support_status == 1">
													<image src="/static/common/icon_collection.png"></image>
												</view>
												<view class="p_fIcon" v-else>
													<image src="/static/common/icon_collection2.png"></image>
												</view>
												<text>{{items.support_num}}</text>
											</view>
										</view>
									</view>
								</view>
							</view>
							<view v-else>
								<u-empty text="暂无动态" icon-color="#eee" color="#eee" mode="data"></u-empty>
							</view>
							<view class="p_dBtn" @tap="toPage('dynamic_list')" v-if="dynaList.length == 3">查看全部动态</view>
						</view>
					</view>
					<!-- 业主评价 -->
					<view class="p_dList" id="tabItem_Eval">
						<view class="p_dTitle">
							<view class="p_dNums" @tap="toPage('evaluate_list')">
								<text>{{designer.comment_num}}个</text>
								<view class="p_dArrow iconfont icon-more"></view>

							</view>
							<text>业主评价</text>
						</view>
						<view class="p_dEval">
							<view v-if="evalList.length > 0 || evalList.length !== 0">

								<view v-for="items in evalList" :key="items.id">
									<view class="p_deItem">
										<view class="p_deHead">
											<image :src="items.user_id.avatar.path" v-if="items.is_anonymous==0"></image>
											<image src="https://manager.ryz1620.com/static/my/avator.png" v-else></image>
										</view>
										<view class="p_deCont">
											<view class="p_deUser">
												<view class="p_deName">{{items.is_anonymous==0?items.user_id.username:'匿名用户'}}</view>
												<view class="p_deTime"><text
														space="ensp">{{items.create_time |formatDate}}</text></view>
												<!-- <view class="p_deRemark">服务：{{items.service_score}} |
													设计：{{items.design_score}} | 施工：{{items.build_score}}</view> -->
													<view class="p_deRemark"> 综合：{{items.overall_score}} | 服务：{{items.service_score}} | 设计：{{items.design_score}}</view>
											</view>
											<view class="p_deMedia">
												<view class="p_deText">{{items.content}}</view>
												<view class="p_deImgs" v-if="items.type == 1">
													<view class="p_deImg" v-for="(itemx,indexx) in items.media"
														:key="indexx" 
														@tap.stop="preview(index,items.media)" v-if="!itemx.cover">
														<image :src="itemx.path"></image>
													</view>
												</view>
												<view class="p_deImgs" v-if="items.type == 2">
													<view class="video-box" v-for="(itemx,indexx) in items.media"
														:key="indexx" v-if="itemx.cover">
														<video  id="myVideo" :src="itemx.path" controls></video>
													</view>
												</view>
											</view>
										</view>
									</view>
								</view>
							</view>
							<view v-else>
								<u-empty text="暂无评论" icon-color="#eee" color="#eee" mode="data"></u-empty>
							</view>
							<view style="display: flex;align-items: center;flex: 1;">
								<!-- v-if="evalList.length == 3" -->
								<!-- <view class="p_dBtn" style="flex: 1;" @click="goEvaluate">立即评价</view> -->
								<view class="p_dBtn" style="flex: 1;" v-if="evalList.length == 3"
									@tap="toPage('evaluate_list')">查看全部评价
								</view>
							</view>
							<!-- <view class="p_dBtn" @tap="toPage('evaluate_list')" v-if="evalList.length == 3">查看全部评价
							</view> -->
						</view>
					</view>
				</view>
			</view>
		</view>

		<view style="width: 100%;padding-bottom: 100rpx;">
			<image src="https://cos.ryz1620.com/liankun/static/teamDetail/teamDetailBg.png" mode="widthFix">
			</image>
		</view>
		<!-- 底部咨询栏 -->

		<!-- <view class="p_consult">
			<view class="p_cShim"></view>
			<view class="p_cBox">
				<view class="p_cBtn1">在线咨询</view>
				<view class="p_cBtn2" @click="callPhone">电话咨询</view>
			</view>
		</view> -->
		<view class="into_shopcart">
			<view class="into_shopcart_box">
				<!-- 左边小图标 -->
				<view class="into_icon">
					<view class="icon_store" @click="callPhone">
						<view class="store">
							<image src="@/static/my/vb.png" />
						</view>
						<text>电话咨询</text>
					</view>
					<view class="icon_service">
						<view class="service">
							<image src="@/static/my/sv.png" />
						</view>
						<text>在线咨询</text>
					</view>
					<!-- #ifndef MP-WEIXIN -->
					<button class="contact_btn" @tap="toCustomer()" plain="true"></button>
					<!-- #endif -->
					<!-- #ifdef MP-WEIXIN -->
					<button class="contact_btn" @click="toCustomer()" plain="true" v-if="!config_id && !config_url"></button>
					<button class="contact_btn" @click="gitpouchatshow" plain="true" v-else></button>
					<!-- #endif -->
				</view>
				<!-- 右边按钮 -->
				<view class="into_btn">
					<!-- 去结算 -->
					<view class="into_settlement" @click="orderadd()"><text>下单</text></view>
				</view>
			</view>
		</view>
		<!-- 弹窗 - 取消关注 -->
		<view class="p_focus" :class="{'active': focusPop}">
			<view class="p_fBg" @tap="focusPop = false"></view>
			<view class="p_fBox popIn">
				<view class="p_fTitle">确定不再关注Ta？</view>
				<view class="p_fBtns">
					<view class="p_fClose" @tap="focusPop = false">取消</view>
					<!-- <view class="p_fConfim" @tap="unFocusAuth">确认</view> -->
				</view>
			</view>
		</view>

		<!-- 弹窗 - 服务信息 -->
		<view class="p_info" :class="{'active': infoPop}">
			<view class="p_iBg" @tap="infoPop = false"></view>
			<view class="p_iBox">
				<view class="p_iClose" @tap="infoPop = false">
					<view class="iconfont icon-cancel"></view>
				</view>
				<view class="p_iTitle">服务信息</view>
				<view class="p_iData">
					<view class="p_iItem">
						<view class="p_iLabel">装修均价</view>
						<view class="p_iVal">
							<text>{{designer.start_offer + '-' + designer.end_offer}}元/m²</text>
							<view class="p_iCutLine"></view>
						</view>
					</view>
					<!-- <view class="p_iItem">
						<view class="p_iLabel">资质信息</view>
						<view class="p_iVal">
							<view>
								<text>{{designer.quality_info.name}}</text>
								<view class="p_iCutLine"></view>
							</view>
						</view>
					</view> -->
					<view class="p_iItem">
						<view class="p_iLabel">服务类型</view>
						<view class="p_iVal">
							<view v-for="item in designer.service_type" :key="item.name">
								<text>{{item.name}}</text>
								<view class="p_iCutLine"></view>
							</view>
						</view>
					</view>
					<view class="p_iItem">
						<view class="p_iLabel">个性签名</view>
						<view class="p_iVal">
							<view
								style="text-overflow: -o-ellipsis-lastline;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;">
								{{designer.sign}}
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>

		<!-- 弹窗 - 评论 -->
		<view class="p_evalute" :class="{'active': commentPop}" @touchmove.stop.prevent="moveHandle">
			<view class="p_eBg"></view>
			<view class="p_eBox">
				<view class="p_eShim" @tap="commentPop = false"></view>
				<view class="p_eContain">
					<view class="p_eClose" @tap="commentPop = false">
						<view class="iconfont icon-cancel"></view>
					</view>
					<view class="p_eTitle">共{{trend_idnum}}条评论</view>
					<scroll-view class="p_eList" scroll-y @scrolltolower="dync_commentNext">
						<view v-for="comment in commentList" :key="comment.id">
							<view class="p_eItem">
								<view class="p_eHead" v-if="comment.user_id.avatar.path">
									<image :src="comment.user_id.avatar.path"></image>
								</view>
								<view class="p_eHead" v-else>
									<image src="https://manager.ryz1620.com/static/my/avator.png"></image>
								</view>
								<view class="p_eCont">
									<view @tap="dync_commentSelectReply(comment.id, comment.user_id.username)">
										<view class="p_eName">{{comment.user_id.username}}
											<!-- <view class="p_eAuth">作者</view> -->
										</view>
										<view class="p_eTxt">{{comment.content}}</view>
										<view class="p_eTxt">
											<view class="p_eTip" style="padding-left: 0;">{{comment.createTime}}</view>
											<view class="p_eTip" @tap.top="getcommentdel(comment.id)"
												v-if="comment.user_id.id == useid">删除</view>
											<view class="p_eTip" v-else style="color: #333;">回复</view>
										</view>
									</view>
									<view class="p_eIts">
										<view v-for="reply in comment.sub_reply" :key="reply.id">
											<view class="p_eiItem"
												@tap="dync_commentSelectReply(reply.id, reply.user_id.username)">
												<view class="p_eiHead" v-if="reply.user_id.avatar.path">
													<image :src="reply.user_id.avatar.path"></image>
												</view>
												<view class="p_eHead" v-else>
													<image src="https://manager.ryz1620.com/static/my/avator.png"></image>
												</view>
												<view class="p_eiCont">
													<view class="p_eiName">{{reply.user_id.username}}</view>
													<view class="p_eiTxt">
														<view v-if="reply.isReplay"
															style="color: #666; font-size: 20rpx;">
															回复<text
																class="p_eiReply">{{reply.reply_id.username}}</text>：
														</view>
														{{reply.content}}
													</view>
													<view class="p_eiTxt">
														<view class="p_eiTip">{{reply.createTime}}</view>
														<view class="p_eiTip" @tap.top="getcommentdel(reply.id)"
															v-if="reply.user_id.id == useid">删除</view>
														<view class="p_eiTip" v-else style="color: #333;">回复</view>
													</view>

												</view>
											</view>
										</view>
									</view>
								</view>
							</view>
						</view>
					</scroll-view>
					<view class="p_eReply">
						<view class="p_erSend" v-if="!commentIsReply" @click="dync_comment">发送</view>
						<view class="p_erSend" v-else @click="dync_commentReply">发送</view>
						<view class="p_erInput">
							<!-- <view class="p_erIcon"><view class="iconfont icon-brow"></view></view> -->
							<input type="text" placeholder-class="placeholder" :focus="commentFocus" v-model="content"
								:placeholder="commentReplyName ? '回复 @' + commentReplyName + ':' : '评论一下吧~'"
								@confirm="dync_comment" @input="inputKey($event, 'comment')" />
						</view>
					</view>
				</view>
			</view>
		</view>
        
		<!-- 微信客服 -->
		<view class="pouchat" v-if="pouchatshow">
		  <view class="poucont">	
			<view class="chatlist">
				<view class="chatml" @click="gitwxchat()" v-if="config_url">
					<image src="https://manager.ryz1620.com/static/my/wxchat.png" mode="widthFix"></image>
					<text class="t1">在线微信客服</text>
					<text class="t2">可直接联系客服</text>
				</view>
				<view class="chatml" v-if="config_id">
					<cell class="cell-service" bind:startmessage='startmessage' bind:completemessage="completemessage" :plugid="config_id"/>
					<image src="https://manager.ryz1620.com/static/my/codechat.png" mode="widthFix"></image>
					<text class="t1">添加微信客服</text>
					<text class="t2">扫微信二维码</text>
				</view>
			</view>
			<view class="iconfont icon-close" @click="wxCodeClick"></view>
		  </view>	
		</view>  
	</view>
</template>

<script>

	import service_design from '@/service/team.js'
	import service_mall from '@/service/mall.js'

	export default {
		data() {
			return {
				designerId: null,
				designer:{
					avatar:{},
					back_thumb_url:{},
					start_offer:'',
					end_offer:'',
				},
				// 数据列表
				demoList: [],
				dynaList: [],
				evalList: [],
				demoNum: 0,
				dynaNum: 0,
				evalNum: 0,
				// Nav栏
				navBackground: 'transparent',
				navTop: 100, // 滑动到此距离，展示nav导航栏，默认值：100
				navShow: false,
				navBackColor: '#fff',
				navFloorOpacity: 0,
				// 关注
				isFocus: false, // 是否关注该设计师
				focusLoading: false,
				focusPop: false,
				// 服务信息
				infoPop: false,
				// 评论
				trend_id: '',
				trend_idnum: '',
				content: '',
				comment: '', // 评论内容
				commentId: null, // 设计动态id
				commentPop: false,
				commentLoading: false,
				commentTime: 0,
				commentPage: 0,
				commentList: [],
				commentIsReply: false,
				commentReplyId: null,
				commentReplyName: null,
				commentFocus: false,
				// tab栏
				tabType: 'Demo', // Demo：案例  Dyna：动态  Eval：评价
				tabBarHeight: 0,
				tabItem_Demo: 0,
				tabItem_Team: 0,
				tabItem_Dyna: 0,
				tabItem_Eval: 0,
				tabBar_Demo: null,
				tabBar_Dyna: null,
				tabBar_Eval: null,
				tabBar_Cursor: null,
				tabBarCursorX: null,
				tabIsScroll: false,
				phone: '',
				userId: "",
				tuanduiArr: [

				],
				config_id:'',
				config_url:'',
				pouchatshow:false,
				share_id:'',
			}
		},

		computed: {
			navHeight() { // Nav栏高度
				var navHeights = uni.getStorageSync('StatusBarHeight')
				// #ifdef  MP-WEIXIN || H5
				return navHeights.height
				// #endif
				// #ifdef APP-PLUS
				return navHeights.height-8
				// #endif
			},
		},

		components: {
			// #ifdef MP-WEIXIN
				"cell": "plugin://contactPlugin/cell",
			// #endif
		},

		onLoad(params) {
			this.$utils.getUrl()
			// testcode
			// console.log(params);
			// params = {designerId: "1"}
			this.designerId = params.designerId
			this.userId = uni.getStorageSync('userId')
			this.gitwxConfig()
			// this.getdesigner()
			let token = uni.getStorageSync('token')
			if (params.share_id) {
				let shareuId = params.share_id
				this.share_id=shareuId
				//uni.setStorageSync('share_id', shareuId);
				this.$store.commit('index/SET_shareuId', shareuId)
				if (token && shareuId) {
					service_mall.getPromoter({
							share_uid: shareuId
						})
						.then(res => {})
				}
			}
		},
		onShareAppMessage(res) {
			let that = this
			if (res.from === 'button') {}
			return {
				title: '找施工',
				path: '/pages_two/pages/construction/list/index?designerId='+this.designerId+'&share_id=' + this
					.userId,
				success: function(res) {}
			}
		},
		onShareTimeline(res) {
			if (res.from === 'menu') {}
			return {
				title: '找施工',
				imageUrl: this.banner[0].img,
				path: '/pages_two/pages/construction/list/index?designerId='+this.designerId+'&share_id=' + this
					.userId,
				success: function(res) {
					
				}
			};
		},
		onShow() {
			this.$utils.getUrl()
			let token = uni.getStorageSync('token')
			if (!token) {
				uni.redirectTo({
					url: '/pages_login/pages/login/login/index'
				});
			}
			this.gitConfig()
			this.getdesigner(this.designerId)
		},
		onReady() {
			let _this = this

			// 获取用户名所在位置
			let Query = uni.createSelectorQuery()
			Query.select("#userName").boundingClientRect(data => {
				if (data.top) _this.navTop = data.top + data.height
			}).exec()
		},

		onPageScroll(e) {
			let scrollTop = e.scrollTop
			if (e.scrollTop >= 200) {
				// Nav栏
				this.navBackground = '#fff'
			} else {
				this.navBackground = 'transparent'
			}
			// 滑动距离超过用户名 => 显示导航栏
			if (scrollTop > this.navTop) {
				if (!this.navShow) {
					this.navShow = true
					this.navBackColor = "#333"
					this.navFloorOpacity = 1
				}

				if (!this.tabIsScroll) {
					scrollTop += this.navHeight + this.tabBarHeight

					if (scrollTop > this.tabItem_Eval) {
						this.tabType = 'Eval'
						this.tabCursorTo('Eval')
					} else {
						if (scrollTop > this.tabItem_Dyna) {
							this.tabType = 'Dyna'
							this.tabCursorTo('Dyna')
						} else if (scrollTop > this.tabItem_Team) {
							// this.tabItem_Team 
							this.tabType = 'Team'
							this.tabCursorTo('Team')
						} else {
							if (scrollTop > this.tabItem_Demo) {
								this.tabType = 'Demo'
								this.tabCursorTo('Demo')
							}
						}
					}
				}
			} else {
				if (this.navShow) {
					this.navShow = false
					this.navBackColor = "#fff"
					this.navFloorOpacity = 0
				}
			}
		},
		filters: {
			formatDate(value) {
				let date = new Date(parseInt(value) * 1000);
				let y = date.getFullYear();
				let m = date.getMonth() + 1;
				m = m < 10 ? "0" + m : m;
				let d = date.getDate();
				d = d < 10 ? "0" + d : d;
				let h = date.getHours();
				h = h < 10 ? "0" + h : h;
				let minute = date.getMinutes();
				let second = date.getSeconds();
				minute = minute < 10 ? "0" + minute : minute;
				second = second < 10 ? "0" + second : second;
				return y + "-" + m + "-" + d + " " + h + ":" + minute + ":" + second;
			}
		},
		onShareAppMessage(res) {
			let that = this
			if (res.from === 'button') {}
			return {
				title: this.designer.title,
				path: '/pages_design/pages/design/personal/personal?designerId=' + this.designerId + '&share_uid=' + this
					.userId,
				success: function(res) {}
			}
		},
		methods: {
			// 获取企业微信callme配置
			gitConfig() {
				service_mall.getCallMeConfig({ partner_type: 'builder', partner_id: this.designerId }).then(res => {
					if (res.code == 1) {
						this.config_id = res.data.config_id;
					}
				});
			},
			gitwxConfig() {
				service_mall.getwxMeConfig({ partner_type: 'builder', partner_id: this.designerId  }).then(res => {
					if (res.code == 1) {
						this.config_url = res.data.url;
					}
				});
			},
			gitpouchatshow(){
				this.pouchatshow = true
			},
			wxCodeClick(){
				this.pouchatshow = false
			},
			gitwxchat(){
				wx.openCustomerServiceChat({
				  extInfo: {url: this.config_url},
				  corpId: this.$env.CORPID,
				  success(res) {}
				})
			},
			goEvaluate() {
				// console.log(this.designer.name);
				uni.navigateTo({
					url: '/pages_two/pages/construction/evaluate/add?designerId=' + this.designerId + '&name=' +
						this.designer.name
				})
			},
			getAddress(data) {
				uni.getLocation({
					success: res => {
						console.log('location success', res)
						uni.openLocation({
							latitude: res.latitude,
							longitude: res.longitude,
							scale: 18
						})
					}
				})
			},
			dviewr(item) {
				let url = encodeURIComponent(item)
				uni.navigateTo({
					url: '/pages_3D/pages/3D/panorama?url=' + url
				});
			},
			orderadd() {
				let tag = '从业' + this.designer.employ_year + '年 | 作品' + this.designer.case_num + ' | 报价' + this.designer
					.start_offer + '-' + this.designer.end_offer + '元/m²'
				uni.navigateTo({
					url: '/pages_two/pages/construction/goOrder/add?designerId=' + this.designerId + '&img=' + this
						.designer.avatar.path + '&tag=' + tag + '&name=' + this.designer.title+'&share_id='+this.share_id
				})
			},
			// 获取设计师信息
			getdesigner(designerId) {
				service_design.getDesigner({
						designerId:designerId
					})
					.then(res => {
						if (res.code == 1) {
							let data = res.data
							// 处理数据
							this.designer = data
							this.demoNum = data.case_num
							this.dynaNum = data.trend_num
							this.evalNum = data.comment_num
							this.isFocus = data.follow_status
							this.phone = data.phone
							// 处理设计案例数据
							let demoList = data.case_list
							// 处理设计动态数据
							let dynaList = data.trend_list
							// 设计师信息
							this.demoList = demoList // 设计案例数据
							this.dynaList = dynaList // 设计动态数据
							this.tuanduiArr = data.team_list
							this.evalList = data.comment_list // 业主评价数据
                            
							this.$store.commit('designer/SET_DESIGNER', data)
							this.$nextTick(() => {
								this.tabGetDomTop()
							})
						}
					})
					.catch(err => {

					})
			},
			// 拨打电话
			callPhone() {
				uni.makePhoneCall({
					phoneNumber: this.phone
				});
			},
			toCustomer() {
				uni.showToast({
					title: '哎呀!不好意思，暂未配置客服...',
					icon: 'none',
					duration: 2000
				});
				// uni.navigateTo({
				// 	url: "/pages_customer/pages/index?partner_type=builder&partner_id=" + this.designerId
				// })
			},
			// 跳转-海报页面
			popShareToPicture(id) {
				uni.navigateTo({
					url: '/pages_design/pages/design/dynamic/share?trendId=' + id
				})
			},
			// 关注or取消关注
			focusSDesigner() {
				let follow = this.isFocus
				if (follow != 0) {
					this.type = 0
					uni.showModal({
						title: '提示',
						content: '确认取消关注?',
						success: (res) => {
							if (res.confirm) {
								service_design.focusDesigner({
										designerId: this.designerId,
										status: 0
									})
									.then(res => {
										if (res.code == 1) {
											this.isFocus = this.type == 1
										} else {
											this.$utils.showErr({
												title: res.msg
											})
										}
									})
								this.popFocus = false

							} else if (res.cancel) {
								return
							}
						}
					});
				} else {
					this.type = 1
					service_design.focusDesigner({
							designerId: this.designerId,
							status: 1
						})
						.then(res => {
							if (res.code == 1) {
								this.isFocus = this.type == 1
							} else {
								this.$utils.showErr({
									title: res.msg
								})
							}
						})
					this.popFocus = false
				}

			},


			// 设计动态==
			// 全文展开
			dyna_showText(id) {
				let list = this.dynaList.list

				for (let i = 0; i < list.length; i++) {
					if (list[i].id === id) {
						list[i].showTalk = !list[i].showTalk
						break
					}
				}
			},

			// 动态点赞
			trendStore(item, index) {
				let status = item.support_status
				if (status == 1) {
					uni.showModal({
						title: '提示',
						content: '确认取消点赞?',
						success: (res) => {
							if (res.confirm) {
								service_design.gitTrendstatus({
										trend_id: item.id,
										status: 0
									})
									.then(res => {
										if (res.code == 1) {
											this.dynaList[index].support_status = 0
											this.dynaList[index].support_num--
										} else {
											this.$utils.showErr({
												title: res.msg
											})
										}
									})
							} else if (res.cancel) {
								return
							}
						}
					});
				} else {
					service_design.gitTrendstatus({
							trend_id: item.id,
							status: 1
						})
						.then(res => {
							if (res.code == 1) {
								this.dynaList[index].support_status = 1
								this.dynaList[index].support_num++
							} else {
								this.$utils.showErr({
									title: res.msg
								})
							}
						})

				}

			},
			// 输入框输入内容事件
			inputKey(event, key) {
				this[key] = event.detail.value
			},
			moveHandle() {},
			// 展示设计动态的评论框
			dyna_showComment(item) {
				this.trend_id = item.id
				this.trend_idnum = item.comment_num
				this.commentPage = 0
				this.commentPop = true
				this.commentLoading = false
				this.commentList = []
				this.dyna_getComment()
			},
			// 获取设计动态的评价内容
			dyna_getComment() {
				if (!this.commentLoading) {
					this.commentLoading = true
					this.commentTime++
					let commentTime = this.commentTime
					let commentPage = this.commentPage + 1
					console.log(commentPage)
					// 获取评论数据
					service_design.getCommentList({
							trend_id: this.trend_id,
							page: commentPage
						})
						.then(res => {
							if (this.commentTime === commentTime) {
								this.commentLoading = false

								if (res.code == 1) {
									let data = res.data
									let list = this.commentList || []
									// 处理数据
									let nowTime = Date.now()
									for (let i = 0; i < data.length; i++) {
										data[i].create_time *= 1000
										data[i].createTime = this.$utils.getDateDiff(data[i].create_time)
										// 处理回复数据
										let replayList = data[i].sub_reply
										if (replayList && replayList.length) {
											for (let j = 0; j < replayList.length; j++) {
												replayList[j].create_time *= 1000
												replayList[j].createTime = this.$utils.getDateDiff(replayList[j]
													.create_time, )

												// 是否是回复 回复数据 的数据
												if (data[i].id !== replayList[j].parent_id) replayList[j].isReplay =
													true
											}
										}
										// 保存数据
										list.push(data[i])
									}
									this.content = ''
									this.commentPage++
									this.commentList = list
								}
							}
						})
						.catch(err => {
							if (this.commentTime === commentTime) {
								this.commentLoading = false
							}
						})
				}
			},
			// 评论
			dync_comment() {
				var that = this
				let content = that.content
				service_design.getcomment({
						trend_id: that.trend_id,
						content: content
					})
					.then(res => {
						if (res.code == 1) {
							that.commentPage = 0
							that.commentList = []
							that.trend_idnum++
							that.content = ''
							content = ''
							that.dyna_getComment()
							that.getdesigner()
						} else {
							uni.showModal({
								title: '提示',
								content: res.msg,
								showCancel: false,
								success(res) {
									if (res.confirm) {
										// console.log('用户点击确定')
										this.content = ''
										content = ''
									}
								}
							})

						}
					})
					.catch(err => {

					})
			},
			// 回复他人评论
			dync_commentSelectReply(id, name) {
				this.commentIsReply = true
				this.commentReplyId = id
				this.commentReplyName = name
				this.content = ''
			},
			// 发布回复评论
			dync_commentReply() {
				service_design.getcommentreply({
						comment_id: this.commentReplyId,
						content: this.content
					})
					.then(res => {
						if (res.code == 1) {
							this.commentIsReply = false
							this.commentPage = 0
							this.commentList = []
							this.content = ''
							this.commentReplyId = ''
							this.commentReplyName = ''
							this.dyna_getComment()
							this.getdesigner()
						} else {
							uni.showModal({
								title: '提示',
								content: res.msg,
								showCancel: false,
								success(res) {
									if (res.confirm) {
										// console.log('用户点击确定')
										this.content = ''
										// content = ''
									}
								}
							})

						}
					})
					.catch(err => {

					})
			},
			// 获取更多评论内容
			dync_commentNext(e) {
				if (!this.commentLoading) {
					this.dyna_getComment()
				}
			},
			// 删除评论
			getcommentdel(id) {
				uni.showModal({
					title: '提示',
					content: '确认删除评论?',
					success: (res) => {
						if (res.confirm) {
							service_design.getcommentdel({
									comment_id: id
								})
								.then(res => {
									if (res.code == 1) {
										this.commentPage = 0
										this.commentList = []
										this.trend_idnum--
										this.content = ''
										this.dyna_getComment()
										this.getdesigner()
									} else {
										this.$utils.showErr({
											title: res.msg
										})
									}
								})
						} else if (res.cancel) {
							return
						}
					}
				});
			},
			GoTeam() {
				uni.navigateTo({
					url: '/pages_two/pages/construction/team/index?designerId=' + this.designerId
				})
			},
			// 跳转页面
			toPage(page, {
				trendId
			} = {}) {
				// 案例列表
				if (page === 'demo_list') {
					uni.navigateTo({
						url: '/pages_two/pages/construction/demo/list?designerId=' + this.designerId
					})
				}
				// 案例详情
				else if (page === 'demo_detail') {
					uni.navigateTo({
						url: '/pages_two/pages/construction/demo/demo?caseId=' + trendId
					})
				}
				// 动态列表
				else if (page === 'dynamic_list') {
					uni.navigateTo({
						url: '/pages_two/pages/construction/dynamic/list?designerId=' + this.designerId
					})
				}
				// 动态详情
				else if (page === 'dynamic_detail') {
					uni.navigateTo({
						url: '/pages_design/pages/design/dynamic/dynamic?trendId=' + trendId
					})
				}
				// 评价列表
				else if (page === 'evaluate_list') {
					uni.navigateTo({
						url: '/pages_two/pages/construction/evaluate/evaluate?designerId=' + this.designerId
					})
				}
			},

			// tab栏操作=======
			// 切换tab栏
			tabToggle(type) {
				let _this = this
				let tabType = _this.tabType
				if (tabType !== type && !_this.tabIsScroll) {
					_this.tabType = type
					_this.tabIsScroll = true

					// 设置导航栏
					_this.navShow = true
					_this.navBackColor = "#333"
					_this.navFloorOpacity = 1

					// 移动到该tab栏所处位置
					let scrollTop = _this["tabItem_" + type]
					let navHeight = _this.navHeight
					let tabBarHeight = _this.tabBarHeight
					uni.pageScrollTo({
						scrollTop: scrollTop - navHeight - tabBarHeight,
						complete() {
							setTimeout(() => {
								_this.tabIsScroll = false
							}, 400)
						}
					})

					// 将光标移动到对应tab位置
					_this.tabCursorTo(type)
				}
			},
			// 预览图片
			preview(index, urls) {
				let img_url = []
				for (let i = 0; i < urls.length; i++) {
					img_url.push(
						urls[i].path
					);
				}
				uni.previewImage({
					urls: img_url,
					current: index,
					longPressActions: {
						itemList: ['发送给朋友', '保存图片', '收藏'],
						success: function(data) {
							console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
						},
						fail: function(err) {
							console.log(err.errMsg);
						}
					}
				});
			},
			previews(urls) {
				let img_url = []
				img_url.push(
					urls
				);
				uni.previewImage({
					urls: img_url,
					longPressActions: {
						itemList: ['发送给朋友', '保存图片', '收藏'],
						success: function(data) {
							console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
						},
						fail: function(err) {
							console.log(err.errMsg);
						}
					}
				});
			},
			// 移动tab栏光标
			tabCursorTo(type) {
				let target = 'tabBar_' + type

				if (this[target] && this.tabBar_Cursor) {
					this.tabBarCursorX = this[target].left + (this[target].width / 2) - (this.tabBar_Cursor.width / 2)
				}
				// 获取tab栏某一项
				else if (this.tabBar_Cursor) {
					uni.createSelectorQuery().select("#" + target).boundingClientRect(res => {
						this[target] = res
						this.tabCursorTo(type)
					}).exec()
				}
				// 获取光标
				else {
					uni.createSelectorQuery().select("#tabBar_Cursor").boundingClientRect(data => {
						this.tabBar_Cursor = data
						this.tabCursorTo(type)
					}).exec()
				}
			},

			// 获取tab栏锚点top 
			tabGetDomTop() {
				// 获取装修案例
				uni.createSelectorQuery().select("#tabItem_Demo").fields({
					rect: true,
					scrollOffset: true
				}, res => {
					this.tabItem_Demo = res.top + res.scrollTop
				}).exec()
				// Team 获取团队
				uni.createSelectorQuery().select("#tabItem_Team").fields({
					rect: true,
					scrollOffset: true
				}, res => {
					this.tabItem_Team = res.top + res.scrollTop
				}).exec()
				// 获取设计动态
				uni.createSelectorQuery().select("#tabItem_Dyna").fields({
					rect: true,
					scrollOffset: true
				}, res => {
					this.tabItem_Dyna = res.top + res.scrollTop
				}).exec()
				// 获取业主评价
				uni.createSelectorQuery().select("#tabItem_Eval").fields({
					rect: true,
					scrollOffset: true
				}, res => {
					this.tabItem_Eval = res.top + res.scrollTop
				}).exec()
				// 获取tab栏高度
				uni.createSelectorQuery().select("#tabBar").boundingClientRect(res => {
					this.tabBarHeight = res.height
				}).exec()
			},

			// 输入框输入内容事件
			inputKey(event, key) {
				this[key] = event.detail.value
			},

			moveHandle() {},
		}
	}
</script>

<style lang="scss" scoped>
	.personal {
		background: #f6f7f8;
	}

	.i_recomd {
		margin-top: 24rpx;

		.i_rOper {
			height: 62rpx;
			line-height: 62rpx;
			font-size: 24rpx;
			padding: 0 72rpx;
			margin-top: 30rpx;
			position: relative;
			float: right;

			.i_roIcon {
				width: 32rpx;
				height: 32rpx;
				margin-top: -16rpx;
				position: absolute;
				top: 50%;
				right: 32rpx;
			}
		}

		.i_tOper {
			height: 62rpx;
			line-height: 62rpx;
			font-size: 24rpx;
			padding: 0 64rpx;
			margin-top: 30rpx;
			position: relative;
			float: right;

			.i_toIcon {
				width: 32rpx;
				height: 32rpx;
				line-height: 32rpx;
				text-align: center;
				color: #6c6c6c;
				font-size: 32rpx;
				margin-top: -16rpx;
				position: absolute;
				top: 50%;
				right: 32rpx;
			}
		}

		.i_rTitle {
			height: 110rpx;
			line-height: 122rpx;
			font-size: 36rpx;
			font-weight: bold;
			padding-left: 32rpx;
		}

		.i_rCan {
			overflow: hidden;
		}

		.i_rList {
			height: 360rpx;
			padding: 0 28rpx;
			white-space: nowrap;
			overflow-x: auto;
		}

		.i_rItem {
			display: inline-block;
			margin-right: 24rpx;
			position: relative;
			background-color: #fff;
			margin-top: 102rpx;
			width: 224rpx;
			box-shadow: 0rpx 6rpx 16rpx rgba(0, 0, 0, 0.06);

			&:nth-last-child(1) {
				margin-right: 0;
			}
		}

		.i_rImage {
			width: 144rpx;
			height: 144rpx;
			overflow: hidden;
			border-radius: 100%;
			position: absolute;
			top: 0;
			left: 50%;
			transform: translate(-50%, -50%);

			image {
				width: 100%;
				height: 100%;
			}
		}

		.i_rtitle {
			position: absolute;
			top: 56rpx;
			left: 50%;
			transform: translate(-50%, 0%);
			line-height: 20px;
			font-size: 18rpx;
			color: #fff;
			background: #030303;
			padding: 0rpx 16rpx;
			border-radius: 26rpx;
			font-weight: 500;
		}

		.i_rText {
			margin-top: 112rpx;
			text-align: center;
			font-size: 28rpx;
			font-weight: 500;
			color: #333333;
			line-height: 48rpx;
		}

		.i_rFee {
			margin-bottom: 28rpx;
			text-align: center;
			font-size: 24rpx;
			font-weight: 400;
			line-height: 44rpx;
			color: #939393;
		}
	}

	.location {
		margin-top: 44rpx;
		height: 116rpx;
		background: url(https://cos.ryz1620.com/liankun/static/builderteam/dingwei.png) no-repeat;
		background-size: 100% 100%;
		display: flex;
		align-items: flex-start;
		flex-direction: column;
		justify-content: center;
		padding: 0 24rpx;

		.location_des {
			display: flex;
			align-items: center;
			justify-content: space-between;
			width: 100%;

			.location_title {
				font-size: 26rpx;
				font-weight: 500;
				line-height: 40rpx;
				color: #333333;
			}

			.location_icon {
				margin-right: 14rpx;
			}
		}

		.location_Mes {
			font-size: 22rpx;
			font-weight: 400;
			line-height: 20px;
			color: #A0A0A0;
			display: flex;
			align-items: center;
			justify-content: space-between;
			width: 100%;
		}
	}

	.p_dNums {
		display: flex;
		align-items: center;

		.icon-more {
			&::before {
				font-size: 28rpx;
				margin-left: 10rpx;
			}
		}
	}

	// 顶部作者栏=====
	.personal .p_auth {
		height: 0;
		position: relative;
		z-index: 500;

		.p_aCan {
			width: 100%;
			overflow: hidden;
			display: flex;
			justify-content: space-between;
			align-items: center;
			opacity: 0;
			transition: opacity .3s;

			&.active {
				opacity: 1;
			}
		}

		.p_aFocus {
			width: 114rpx;
			height: 48rpx;
			line-height: 48rpx;
			text-align: center;
			color: #fff;
			font-size: 20rpx;
			margin: 0 36rpx 0 40rpx;
			border-radius: 28rpx;
			background: #333;
			float: right;

			&.active {
				color: #939393;
				background: #f6f7fb;
			}
		}

		.p_aHead {
			width: 68rpx;
			height: 68rpx;
			margin-right: 28rpx;
			border-radius: 50%;
			background: #f0f0f0;
			overflow: hidden;
			float: left;
		}

		.p_aName {
			height: 40rpx;
			line-height: 40rpx;
			overflow: hidden;
			flex: 1;
		}
	}


	// 背景墙=====
	.personal .p_wall {
		height: 316rpx;
		position: relative;

		.p_wPicture {
			width: 100vw;
			height: 500rpx;
			background: #f0f0f0;
			position: absolute;
			top: 0;
			left: 0;
		}

		.p_wShadow {
			width: 100vw;
			height: 500rpx;
			background: linear-gradient(180deg, rgba(18, 19, 23, .3) 0%, rgba(255, 255, 255, .3) 100%);
			position: absolute;
			top: 0;
			left: 0;
		}
	}


	// 用户信息=====
	.personal .p_user {
		padding: 126rpx 32rpx 40rpx;
		background: #fff;
		position: relative;

		// 头像
		.p_uHeadimg {
			width: 172rpx;
			height: 172rpx;
			border: 6rpx solid #ffd425;
			border-radius: 50%;
			background: #f0f0f0;
			position: absolute;
			top: -86rpx;
			left: 32rpx;
			box-shadow: 0 6rpx 16rpx 0 rgba(0, 0, 0, .16);
			box-sizing: border-box;
			overflow: hidden;
		}

		// 关注按钮
		.p_uFocus {
			width: 156rpx;
			height: 56rpx;
			padding: 30rpx 32rpx;
			position: absolute;
			top: 0;
			right: 0;
			box-sizing: content-box;

			.p_ufCan {
				height: 56rpx;
				color: #fff;
				font-size: 26rpx;
				border-radius: 28rpx;
				background: #333;
				display: flex;
				justify-content: center;
				align-items: center;
			}

			.p_ufCan.active {
				color: #939393;
				background: #f6f7fb;
			}

			&:active .p_ufCan {
				opacity: .88;
			}
		}

		.p_uName {
			height: 60rpx;
			line-height: 60rpx;
			font-size: 44rpx;
			font-weight: bold;
			padding-left: 4rpx;
		}

		// 基础信息
		.p_uBase {
			padding-left: 4rpx;
			margin-top: 4rpx;
			overflow: hidden;
		}

		.p_ubItem {
			height: 44rpx;
			line-height: 44rpx;
			font-size: 24rpx;
			margin-right: 40rpx;
			float: left;

			&>text {
				font-size: 32rpx;
			}
		}

		// 标签
		.p_uTags {
			line-height: 0;
			padding: 18rpx 0 0 0;
		}

		.p_uTag {
			height: 48rpx;
			line-height: 48rpx;
			color: #a58f6d;
			font-size: 24rpx;
			padding: 0 18rpx;
			margin-top: 10rpx;
			margin-right: 16rpx;
			border-radius: 24rpx;
			background: #f9f6f3;
			display: inline-block;
		}

		// 备注信息
		.p_uData {
			padding: 36rpx;
			margin-top: 28rpx;
			border-radius: 10rpx;
			background: rgba(246, 247, 251, .4);
			position: relative;
			box-shadow: 0rpx 0rpx 16rpx rgba(0, 0, 0, 0.06);
		}

		.p_udMore {
			width: 104rpx;
			height: 80rpx;
			position: absolute;
			top: 0;
			right: 0;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.p_udIcon {
			width: 32rpx;
			height: 32rpx;
		}

		.p_udItem {
			min-height: 34rpx;
			line-height: 34rpx;
			font-size: 24rpx;
			margin-top: 20rpx;

			&:first-child {
				margin: 0;
			}
		}

		.p_udLabel {
			color: #939393;
			padding-right: 30rpx;
			float: left;
		}

		.p_udVal {
			min-height: 34rpx;
			overflow: hidden;
			display: flex;
			flex-wrap: wrap;
			align-items: center;
		}

		.p_udCutline {
			width: 1px;
			height: 12rpx;
			margin: 0 8rpx;
			background: #333;
			display: inline-block;

			&:nth-last-child(1) {
				display: none;
			}
		}
	}


	// 数据列表=====
	.personal .p_data {

		// 数据列表（案例、动态、评价）=====
		.p_dContain {
			padding-top: 16rpx;
			background: #fff;
		}

		// tab栏
		.p_dSticky {
			position: sticky;
			top: 0;
			z-index: 11;
		}

		.p_dTabs {
			height: 108rpx;
			background: #fff;
			position: relative;
			display: flex;
			justify-content: space-between;

			&::after {
				content: "";
				width: 100%;
				height: 1px;
				background: #f4f4f4;
				position: absolute;
				left: 0;
				bottom: 0;
				transform: scaleY(.5);
			}
		}

		.p_dtItem {
			width: 136rpx;
			height: 108rpx;
			line-height: 108rpx;
			text-align: center;
			float: left;

			&.active {
				font-size: 32rpx;
				font-weight: bold;
			}
		}

		.p_dtCursor {
			width: 40rpx;
			height: 8rpx;
			border-radius: 4rpx 4rpx 0 0;
			background: #ffd425;
			position: absolute;
			left: 0;
			bottom: 0;
			transition: all .3s;
		}

		// 数据列表
		.p_dList {
			padding-top: 40rpx;
			margin-top: 16rpx;
			background: #fff;

			&:nth-child(1) {
				padding-top: 60rpx;
				margin-top: 0;
			}
		}

		.p_dTitle {
			height: 50rpx;
			line-height: 50rpx;
			font-size: 36rpx;
			font-weight: bold;
			padding: 0 36rpx;
			position: relative;
		}

		.p_dNums {
			height: 90rpx;
			line-height: 90rpx;
			font-size: 24rpx;
			font-weight: normal;
			padding: 0 24rpx 0 40rpx;
			position: absolute;
			right: 32rpx;
			top: -20rpx;
			display: flex;
			align-items: center;
		}

		.p_dArrow {
			// width: 32rpx;
			// height: 32rpx;
			// line-height: 30rpx;
			color: #6c6c6c;
			font-size: 32rpx;
			// position: absolute;
			// top: 28rpx;
			// right: -4rpx;
		}

		.p_dBtn {
			height: 80rpx;
			line-height: 80rpx;
			text-align: center;
			margin: 0 32rpx 40rpx;
			border-radius: 4rpx;
			background: #F8F8F8;
			box-sizing: content-box;
			font-size: 28rpx;
			font-weight: 600;
			color: #333333;
		}

		// 装修案例/设计动态/业主评价 底线
		.p_dDemo .p_ddItem,
		.p_dDyna .p_ddItem,
		.p_dEval .p_deItem {
			position: relative;

			&::after {
				content: "";
				height: 1px;
				background: #f4f4f4;
				position: absolute;
				bottom: 0;
				left: 32rpx;
				right: 32rpx;
				transform: scaleY(.5);
			}

			&:nth-last-child(1)::after {
				content: none;
			}
		}

		// 装修案例
		.p_dDemo {
			padding-top: 28rpx;
			overflow: hidden;

			.p_ddItem {
				padding: 42rpx 0 40rpx;

				&:nth-child(1) {
					padding-top: 0;
				}
			}

			.p_ddBanner {
				height: 376rpx;
				margin: 0 32rpx;
				border-radius: 8rpx;
				background: #f0f0f0;
				overflow: hidden;
				position: relative;
			}

			.p_ddInfo {
				min-height: 34rpx;
				line-height: 34rpx;
				font-size: 24rpx;
				margin: 18rpx 32rpx 0;
			}

			.p_ddTag {
				height: 36rpx;
				line-height: 36rpx;
				color: #a98f68;
				font-size: 20rpx;
				padding: 0 20rpx;
				margin-top: -2rpx;
				margin-right: 16rpx;
				border-radius: 18rpx;
				background: #f9f6f3;
				float: left;
			}

			.p_ddCont {
				overflow: hidden;
			}

			.p_ddVal {
				display: flex;
				flex-wrap: wrap;
				align-items: center;
			}

			.p_ddCutLine {
				width: 1px;
				height: 12rpx;
				margin: 0 8rpx;
				background: #333;
				display: inline-block;

				&:nth-last-child(1) {
					display: none;
				}
			}

			.p_ddRemark {
				line-height: 44rpx;
				font-size: 32rpx;
				font-weight: bold;
				padding: 0 36rpx;
				margin-top: 8rpx;
			}
		}

		// 设计动态
		.p_dDyna {
			overflow: hidden;

			.p_ddItem {
				padding-top: 40rpx;
			}

			// 用户信息
			.p_ddUser {
				padding: 0 32rpx;
			}

			.p_ddHead {
				width: 84rpx;
				height: 84rpx;
				margin-right: 20rpx;
				border-radius: 50%;
				background: #f0f0f0;
				overflow: hidden;
				float: left;
			}

			.p_ddCan {
				padding-top: 6rpx;
				overflow: hidden;
			}

			.p_ddName {
				height: 40rpx;
				line-height: 40rpx;
				font-weight: bold;
			}

			.p_ddTime {
				height: 34rpx;
				line-height: 34rpx;
				color: #939393;
				font-size: 24rpx;
			}

			// 标签
			.p_ddTags {
				margin: 18rpx 32rpx 0;
				overflow: hidden;
			}

			.p_ddTag {
				height: 44rpx;
				line-height: 44rpx;
				color: #a58f6d;
				font-size: 24rpx;
				padding: 0 20rpx 0 48rpx;
				border-radius: 22rpx;
				background: #f9f6f3;
				position: relative;
				float: left;
			}

			.p_ddTag-icon {
				width: 36rpx;
				height: 36rpx;
				position: absolute;
				top: 4rpx;
				left: 4rpx;
			}

			// 内容
			.p_ddText {
				line-height: 44rpx;
				margin: 0rpx 36rpx 0;
				overflow: hidden;
				text-overflow: ellipsis;
				display: -webkit-box;
				-webkit-line-clamp: 3;
				-webkit-box-orient: vertical;
			}

			.p_ddAll {
				height: 36rpx;
				line-height: 36rpx;
				color: #a98f68;
				font-size: 26rpx;
				margin-top: 8rpx;
				position: relative;
			}

			.p_ddAll-click {
				width: 140rpx;
				height: 70rpx;
				position: absolute;
				top: -18rpx;
				left: -36rpx;
			}

			.p_ddImgs {
				padding: 18rpx 0 0 32rpx;
				overflow: hidden;
			}

			.p_ddImg {
				width: 220rpx;
				height: 220rpx;
				margin: 12rpx 14rpx 0 0;
				border-radius: 4rpx;
				background: #f0f0f0;
				overflow: hidden;
				float: left;
			}

			// 底部功能键
			.p_funs {
				padding: 20rpx 32rpx 22rpx;
				display: flex;
			}

			.p_fun {
				height: 74rpx;
				display: flex;
				flex: 1;
				justify-content: center;
				align-items: center;

				&:nth-child(1) {
					justify-content: flex-start;
				}

				&:nth-last-child(1) {
					justify-content: flex-end;
				}
			}

			.p_fIcon {
				width: 40rpx;
				height: 40rpx;
				line-height: 40rpx;
				color: #6c6c6c;
				font-size: 40rpx;
				margin-right: 16rpx;
				display: inline-block;
			}
		}

		// 业主评价
		.p_dEval {
			padding-top: 40rpx;
			overflow: hidden;

			.p_deItem {
				padding: 40rpx 0;

				&:nth-child(1) {
					padding-top: 0;
				}
			}

			.p_deHead {
				width: 84rpx;
				height: 84rpx;
				margin: 0 20rpx 0 32rpx;
				border-radius: 50%;
				background: #f0f0f0;
				overflow: hidden;
				float: left;
			}

			.p_deCont {
				overflow: hidden;
			}

			.p_deUser {
				padding: 8rpx 36rpx 0 0;
			}

			.p_deTime {
				height: 34rpx;
				line-height: 34rpx;
				color: #939393;
				font-size: 24rpx;
			}

			.p_deName {
				height: 40rpx;
				line-height: 40rpx;
				font-weight: bold;
			}

			.p_deStars {
				height: 20rpx;
				margin-top: 8rpx;
			}

			.p_deStar {
				width: 20rpx;
				height: 20rpx;
				margin-right: 8rpx;
				float: left;
			}

			.p_deRemark {
				height: 34rpx;
				line-height: 34rpx;
				color: #939393;
				font-size: 24rpx;
				margin-top: 16rpx;
			}

			.p_deText {
				line-height: 44rpx;
				padding-right: 36rpx;
				margin-top: 28rpx;
			}

			.p_deImgs {
				// padding-top: 16rpx;
				overflow: hidden;
			}
           .video-box {
           	width: 398rpx;
           	height: 308rpx;
           	margin: 12rpx 10rpx 0 0;
           	border-radius: 4rpx;
           	background: #f0f0f0;
           	float: left;
           	overflow: hidden;
           
           	video {
           		width: 100%;
           		height: 100%;
           	}
           }
			.p_deImg {
				width: 188rpx;
				height: 188rpx;
				margin: 12rpx 10rpx 0 0;
				border-radius: 4rpx;
				background: #f0f0f0;
				float: left;
				overflow: hidden;
			}
		}
	}


	// 底部咨询栏=====
	.personal .p_consult {
		.p_cShim {
			height: 156rpx;
			padding-bottom: constant(safe-area-inset-bottom);
			padding-bottom: env(safe-area-inset-bottom);
		}

		.p_cBox {
			width: 100vw;
			height: 152rpx;
			padding-bottom: constant(safe-area-inset-bottom);
			padding-bottom: env(safe-area-inset-bottom);
			background: #fff;
			position: fixed;
			bottom: 0;
			left: 0;
			z-index: 1000;
			display: flex;
			justify-content: center;
			align-items: center;
		}

		.p_cBtn1,
		.p_cBtn2 {
			width: 342rpx;
			height: 72rpx;
			color: #fff;
			border-radius: 4rpx 0 0 4rpx;
			background: #c3ab7c;
			box-sizing: border-box;
			display: flex;
			justify-content: center;
			align-items: center;

			&:active {
				opacity: .88;
			}
		}

		.p_cBtn2 {
			border-radius: 0 4rpx 4rpx 0;
			background: #333;
		}
	}

	// 固定条
	.into_shopcart {
		width: 100%;
		height: 100rpx;
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 301;
		background-color: #fff;
		display: flex;
		align-items: center;

		&_box {
			padding: 14rpx 22rpx;
			display: flex;

			// 左边小图标
			.into_icon {
				display: flex;
				position: relative;
				width: 260rpx;

				.icon_store {
					width: 100rpx;
					margin-left: 30rpx;
					display: flex;
					flex-wrap: wrap;
					justify-content: center;

					.store {
						width: 32rpx;
						height: 30rpx;

						image {
							width: 100%;
							height: 100%;
						}
					}

					text {
						font-size: 22rpx;
						font-weight: 400;
						line-height: 32rpx;
						color: #333333;
						margin-top: 6rpx;
					}
				}

				.icon_service {
					width: 100rpx;
					display: flex;
					flex-wrap: wrap;
					justify-content: center;
					position: absolute;
					right: 6rpx;
					top: 2rpx;

					.service {
						width: 34rpx;
						height: 32rpx;

						image {
							width: 100%;
							height: 100%;
						}
					}

					text {
						font-size: 22rpx;
						font-weight: 400;
						line-height: 32rpx;
						color: #333333;
						margin-top: 6rpx;
					}
				}

				.contact_btn {
					width: 44rpx;
					height: 74rpx;
					margin-left: 46rpx;
				}

				button[plain] {
					border: 0 none;
				}
			}

			// 右边按钮
			.into_btn {
				width: 380rpx;
				height: 72rpx;
				border-radius: 10rpx;
				margin-left: 50rpx;
				display: flex;

				.join_cart {
					width: 226rpx;
					height: 100%;
					text-align: center;
					line-height: 72rpx;
					background-color: #C3AB7C;
					border-radius: 10rpx 0rpx 0rpx 10rpx;

					text {
						font-size: 28rpx;
						font-weight: 500;
						line-height: 40rpx;
						color: #FFFFFF;
					}
				}

				.into_settlement {
					width: 100%;
					height: 100%;
					text-align: center;
					line-height: 72rpx;
					background-color: #C3AB7C;
					border-radius: 70rpx;

					text {
						font-size: 28rpx;
						font-weight: 500;
						line-height: 40rpx;
						color: #FFFFFF;
					}
				}
			}
		}
	}

	// 弹窗 - 取消关注=====
	// 动画效果：
	// 画板，隐藏阶段，.3s后隐藏画板
	// 背景：.3s时间，【显示】opacity(0 -> 1) 【隐藏】opacity(1 -> 0)
	// 弹窗：.3s时间，
	//    【显示】
	//     0%: transform: scale3d(0.6, 0.6, 0.6);opacity: .6;
	//     80% {transform: scale3d(1.1, 1.1, 1.1);opacity: 1;}
	//     100% {transform: scale3d(1, 1, 1);opacity: 1;}
	//    【隐藏】
	//     0% {transform: scale3d(1, 1, 1);opacity: 1;}
	//     20% {transform: scale3d(1.1, 1.1, 1.1);opacity: 1;}
	//     100% {transform: scale3d(0.6, 0.6, 0.6);opacity: .6;}
	.personal .p_focus {
		width: 100vw;
		height: 100vh;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1001;
		visibility: hidden;
		transition: visibility .3s;

		&.active {
			visibility: visible;

			.p_fBg {
				opacity: 1;
			}

			.p_fBox {
				animation: popFocusIn .3s;
			}
		}

		.p_fBg {
			width: 100%;
			height: 100%;
			background: rgba(0, 0, 0, .6);
			transition: opacity .3s;
			opacity: 0;
		}

		.p_fBox {
			width: 500rpx;
			height: 240rpx;
			margin-top: -120rpx;
			margin-left: -250rpx;
			border-radius: 8rpx;
			background: #fff;
			position: absolute;
			top: 50%;
			left: 50%;
			animation: popFocusOut .3s;
		}

		.p_fTitle {
			height: 40rpx;
			line-height: 40rpx;
			text-align: center;
			font-weight: bold;
			margin-top: 60rpx;
		}

		.p_fBtns {
			margin: 40rpx 40rpx 0;
		}

		.p_fClose,
		.p_fConfim {
			width: 196rpx;
			height: 60rpx;
			line-height: 60rpx;
			text-align: center;
			border-radius: 30rpx;
			background: #f6f7fb;
			float: left;

			&:active {
				opacity: .88;
			}
		}

		.p_fConfim {
			background: #ffd425;
			float: right;
		}
	}

	@keyframes popFocusIn {
		0% {
			transform: scale3d(0.6, 0.6, 0.6);
			opacity: .6;
		}

		80% {
			transform: scale3d(1.1, 1.1, 1.1);
			opacity: 1;
		}

		100% {
			transform: scale3d(1, 1, 1);
			opacity: 1;
		}
	}

	@keyframes popFocusOut {
		0% {
			transform: scale3d(1, 1, 1);
			opacity: 1;
		}

		20% {
			transform: scale3d(1.1, 1.1, 1.1);
			opacity: 1;
		}

		100% {
			transform: scale3d(0.72, 0.72, 0.72);
			opacity: .72;
		}
	}


	// 弹窗 - 服务信息=====
	// 动画效果：
	// 画板，隐藏阶段，.3s后隐藏画板
	// 背景：.3s时间，【显示】opacity(0 -> 1) 【隐藏】opacity(1 -> 0)
	// 弹窗：.3s时间，【显示】transform: translateY(0) 【隐藏】transform: translateY(100%)
	.personal .p_info {
		width: 100vw;
		height: 100vh;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1001;
		visibility: hidden;
		transition: visibility .3s;

		&.active {
			visibility: visible;

			.p_iBg {
				opacity: 1;
			}

			.p_iBox {
				transform: translateY(0);
			}
		}

		.p_iBg {
			width: 100%;
			height: 100%;
			background: rgba(0, 0, 0, .6);
			transition: opacity .3s;
			opacity: 0;
		}

		.p_iBox {
			width: 100%;
			height: 968rpx;
			border-radius: 24rpx 24rpx 0 0px;
			background: #fff;
			position: absolute;
			left: 0;
			bottom: 0;
			transition: transform .3s;
			transform: translateY(100%);
		}

		.p_iClose {
			width: 104rpx;
			height: 132rpx;
			line-height: 132rpx;
			text-align: center;
			font-size: 40rpx;
			position: absolute;
			top: 0;
			right: 0;
		}

		.p_iTitle {
			height: 50rpx;
			line-height: 50rpx;
			text-align: center;
			font-size: 36rpx;
			font-weight: bold;
			margin-top: 40rpx;
		}

		.p_iData {
			margin-top: 60rpx;
		}

		.p_iItem {
			margin: 40rpx 36rpx 0;
		}

		.p_iLabel {
			line-height: 40rpx;
			color: #939393;
			margin-right: 40rpx;
			float: left;
		}

		.p_iVal {
			min-height: 40rpx;
			line-height: 40rpx;
			overflow: hidden;
			display: flex;
			flex-wrap: wrap;
			align-items: center;
		}

		.p_iCutLine {
			width: 1px;
			height: 12rpx;
			margin: 0 8rpx;
			background: #333;
			display: inline-block;

			&:nth-last-child(1) {
				display: none;
			}
		}
	}


	// 弹窗 - 评论=====
	// 动画效果：
	// 画板，隐藏阶段，.3s后隐藏画板
	// 背景：.3s时间，【显示】opacity(0 -> 1) 【隐藏】opacity(1 -> 0)
	// 弹窗：.3s时间，【显示】transform: translateY(0) 【隐藏】transform: translateY(100%)
	.personal .p_evalute {
		width: 100vw;
		height: 100vh;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 1001;
		visibility: hidden;
		transition: visibility .3s;

		&.active {
			visibility: visible;

			.p_eBg {
				opacity: 1;
			}

			.p_eContain {
				transform: translateY(0);
			}
		}

		.p_eBg {
			width: 100%;
			height: 100%;
			background: rgba(0, 0, 0, .6);
			transition: opacity .3s;
			opacity: 0;
		}

		.p_eBox {
			width: 100%;
			height: 100%;
			position: absolute;
			top: 0;
			left: 0;
			display: flex;
			flex-flow: column;
		}

		.p_eShim {
			height: 256rpx;
		}

		.p_eContain {
			padding-bottom: constant(safe-area-inset-bottom);
			padding-bottom: env(safe-area-inset-bottom);
			border-radius: 24rpx 24rpx 0 0;
			background: #fff;
			position: relative;
			overflow: hidden;
			display: flex;
			flex-flow: column;
			flex: 1;
			transition: transform .3s;
			transform: translateY(100%);
		}

		.p_eClose {
			width: 104rpx;
			height: 120rpx;
			line-height: 120rpx;
			text-align: center;
			font-size: 40rpx;
			position: absolute;
			top: 0;
			right: 0;
		}

		.p_eTitle {
			height: 120rpx;
			line-height: 120rpx;
			text-align: center;
			font-weight: bold;
		}

		// 评论
		.p_eList {
			padding-left: 32rpx;
			padding-bottom: 112rpx;
			overflow-y: auto;
			flex: 1;
		}

		.p_eCan {
			height: 100%;
		}

		.p_eItem {
			margin-top: 30rpx;

			&:nth-child(1) {
				margin-top: 20rpx;
			}

			&:nth-last-child(1) .p_eCont::after {
				content: none;
			}
		}

		.p_eHead,
		.p_eIts .p_eiHead {
			width: 66rpx;
			height: 66rpx;
			margin-right: 16rpx;
			border-radius: 50%;
			background: #f0f0f0;
			float: left;
		}

		.p_eCont {
			padding-bottom: 28rpx;
			position: relative;
			overflow: hidden;

			&::after {
				content: "";
				width: 100%;
				height: 1px;
				background: #f4f4f4;
				position: absolute;
				bottom: 0;
				left: 0;
				transform: scaleY(.5);
			}
		}

		.p_eName,
		.p_eIts .p_eiName {
			height: 28rpx;
			line-height: 28rpx;
			color: #939393;
			font-size: 20rpx;
		}

		.p_eAuth,
		.p_eIts .p_eiAuth {
			width: 64rpx;
			height: 28rpx;
			line-height: 28rpx;
			text-align: center;
			color: #333;
			font-size: 20rpx;
			margin-left: 8rpx;
			border-radius: 28rpx;
			background: #f6f7fb;
			display: inline-block;
		}

		.p_eTxt,
		.p_eIts .p_eiTxt {
			min-height: 34rpx;
			line-height: 34rpx;
			font-size: 24rpx;
			padding-right: 32rpx;
			margin-top: 4rpx;
		}

		.p_eTip,
		.p_eIts .p_eiTip {
			color: #939393;
			font-size: 20rpx;
			padding-left: 16rpx;
			display: inline-block;
		}

		// 他人回复
		.p_eiItem {
			margin-top: 16rpx;
		}

		.p_eiCont {
			overflow: hidden;
		}

		.p_eiReply {
			color: #939393;
			font-size: 20rpx;
			padding: 0 4rpx;
		}

		// 回复框
		.p_eReply {
			width: 100%;
			height: 112rpx;
			padding-left: 32rpx;
			background: #fff;
			position: absolute;
			bottom: 0;
			left: 0;
			box-shadow: 0 0 20rpx 0 rgba(0, 0, 0, .1);

			.p_erSend {
				width: 108rpx;
				height: 112rpx;
				line-height: 112rpx;
				color: #939393;
				padding-left: 16rpx;
				float: right;
			}

			.p_erInput {
				height: 64rpx;
				margin-top: 24rpx;
				border-radius: 32rpx;
				background: #f6f7fb;
				position: relative;
				overflow: hidden;

				&>input {
					width: 100%;
					height: 100%;
					padding: 0 88rpx 0 28rpx;
				}
			}

			.p_erIcon {
				width: 88rpx;
				height: 64rpx;
				line-height: 64rpx;
				color: #6c6c6c;
				font-size: 48rpx;
				text-align: center;
				position: absolute;
				top: 0;
				right: 0;
			}
		}

		// 回复框
		// .p_eReply {width: 100%;height: 112rpx;background: #fff;position: absolute;bottom: 0;left: 0;box-shadow: 0 0 20rpx 0 rgba(0, 0, 0, .1);
		// 	.p_erCan {height: 64rpx;margin: 24rpx 108rpx 0 32rpx;border-radius: 32rpx;background: #f6f7fb;}
		// 	.p_erInput {width: 100%;height: 100%;padding: 24rpx 196rpx 24rpx 60rpx;position: absolute;left: 0;top: 0;z-index: 1;}
		// 	.p_erIcon {width: 88rpx;height: 112rpx;line-height: 112rpx;color: #6c6c6c;font-size: 48rpx;text-align: center;position: absolute;top: 0;right: 108rpx;z-index: 3;}
		// 	.p_erSend {width: 108rpx;height: 112rpx;line-height: 112rpx;color: #939393;padding-left: 16rpx;position: absolute;top: 0;right: 0;z-index: 2;}
		// }
	}
// 客服弹框
	.pouchat{
		position: fixed;
		background: rgba(0,0,0,0.5);
		top:0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 9999;
		.poucont{
			position: absolute;
			top:30%;
			left: 15%;
			right: 15%;
			.icon-close{
				width: 80rpx;
				height: 80rpx;
				font-size: 70rpx;
				color: #fff;
				line-height: 80rpx;
				text-align: center;
				margin: 30rpx auto;
			}
		}
		.chatlist{
			background: #fff;
			padding:30rpx;
			border-radius: 10rpx;
		}
		.chatml{
			position: relative;
			padding: 20rpx;
			padding-left: 100rpx;
			min-height: 100rpx;
			.cell-service{
				position: absolute;
				right: 0;
				bottom: 0;
				left: 0;
				top: 0;
				opacity: 0;
				z-index: 10;
				.cell--bubble{
					width: 100%;
				}
			}
			text{
				display: block;
				line-height: 40rpx;
			}
			.t1{
				font-size: 32rpx;
			}
			.t2{
				font-size: 24rpx;
				color: #999;
			}
			image{
				width: 70rpx;
				height: 70rpx;
				position: absolute;
				left: 15rpx;
				top:25rpx;
			}
		}
	}	
</style>
